<template>
	<view class="content">
		<view class="head row">
			<view class="col-18">
				<view class="col-24 headtt t_size_34 t_size_bold">
					{{result.serviceTypeTitle }}
				</view>
				<view class="col-24 headxq t_size_28">
					已同意客服听取本次行程录音作为判责依据
				</view>
			</view>
			<view class="col-6 t_right" v-if="result.feedbackState == 0">
				<image src="../../static/account/clz_tb.png" mode="heightFix"></image>
			</view>
		</view>
		<view class="row cljdxq" v-if="result.feedbackState  == 1">
			<view class="col-24">
				<view class="row xqkt">
					<view class="col-3 t_center">
						<image src="../../static/account/jxz.png" mode="heightFix"></image>
					</view>
					<view class="col-6 t_size_bold">
						处理结果
					</view>
					<view class="col-15 t_right dqjdsj">
						{{result.feedbackStateTime}}
					</view>
				</view>
				<view class="row xqqk">
					<view class="col-3">
						<view>
							
						</view>
					</view>
					<view class="col-21 xqqknr">
						<view class="col-24">
							{{result.feedbackReason}}({{result.gainDesc}})
						</view>
					</view>
				</view>
			</view>
		</view>
		<view class="row cljdxq">
			<view class="col-24">
				<view class="row xqkt">
					<view class="col-3 t_center">
						<image src="../../static/account/ytj.png" mode="heightFix"></image>
					</view>
					<view class="col-6 t_size_bold">
						提交成功
					</view>
					<view class="col-15 t_right dqjdsj">
						{{result.createTime }}
					</view>
				</view>
				<view class="row xqqk">
					<view class="col-3">
						<!-- <view>
							
						</view> -->
					</view>
					<view class="col-21 xqqknr">
						<view class="col-24">
							{{result.remarks}}
						</view>
						<view class="col-24">
							<view class="row img">
								<view class="col-7 set-1" v-for="(item,index) in result.voucherImages.split(',')" :key="index">
									<image :src="item" mode="aspectFill" @click="preImage(index)"></image>
								</view>
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data(){
			return {
				feedbackId:0,
				result: {
					createTime:'', //创建时间 ,
					feedbackReason:'', //处理结果 ,
					feedbackState:'', //处理状态：0处理中 1处理完成 ,
					feedbackStateTime:'', // 处理完成时间 ,
					gainDesc:'' , //调取车内音视频说明（如果没有调取返回空） ,
					remarks: '', //反馈备注 ,
					serviceTypeTitle:'', // 服务类型名称 ,
					voucherImages: '', //凭证图片（多张用英文,号隔开）
				}
			}
		},
		onLoad(option) {
			this.feedbackId = option.feedbackId;
			this.load();
		},
		methods: {
			async load(){
				let res = await this.$api.request(this.$api.customer.feedback_info,{feedbackId: this.feedbackId});
				if(res){
					this.result = res;
				}
			},
			preImage(index){
				uni.previewImage({
					urls:this.result.voucherImages.split(','),
					count:this.result.voucherImages.split(',').length,
					current:index
				})
			}
		}
	}
</script>

<style lang="scss">
	.head{
		width: 92%;
		height: 120rpx;
		padding: 40rpx 4%;
		color: #FFFFFF;
		background: linear-gradient(to right,#6CBF30,#95DD60);
		image{
			height: 120rpx;
		}
		.headtt{
			height: 70rpx;
			line-height: 70rpx;
		}
		.headxq{
			height: 50rpx;
			line-height: 70rpx;
			overflow: hidden;
		}
	}
	.cljdxq{
		width: 92%;
		padding: 31rpx 4%;
		.xqkt{
			height: 113rpx;
			line-height: 113rpx;
			color: #333333;
			image{
				margin-top: 28rpx;
				height: 57rpx;
			}
			.dqjdsj{
				color: #B3B3B3;
			}
		}
		.xqqk{
			color: #999999;
			.col-3{
				view{
					width: 1px;
					height: 100%;
					border-left: 1px dotted #999999;
					margin: 0 calc((100% - 1px) / 2);
				}
			}
			.img{
				margin-top: 25rpx;
				height: 200rpx;
				image{
					width: 100%;
					height: 100%;
					border-radius: 13rpx;
				}
			}
		}
	}
</style>
